<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>专业数据处理平台</title>
    <meta name="description" content="这是一个 workDetail 页面">
    <meta name="keywords" content="workDetail">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link rel="icon" type="image/png" href="${ctx}/assets/i/favicon.png">
    <link rel="apple-touch-icon-precomposed" href="${ctx}/assets/i/app-icon72x72@2x.png">
    <meta name="apple-mobile-web-app-title" content="Amaze UI" />
    <link rel="stylesheet" href="${ctx}/assets/css/amazeui.min.css" />
    <link rel="stylesheet" href="${ctx}/assets/css/admin.css">
    <link rel="stylesheet" href="${ctx}/assets/css/app.css">
    <link rel="stylesheet" type="text/css" href="${ctx}/assets/css/xcConfirm.css"/>
    <style>
        .my-form-height{
            height: 60px;
            overflow:hidden;
        }
        .my-form-label{
            color: #999;
            height: 60px;
            line-height: 60px;
            text-align: right;
            width: 140px;
            position: absolute;
            top: 0;
            left: 0;
        }
        .my-form-content{
            padding-left: 145px;
            padding-right: 0;
            width: 100%;
            height: 60px;
            line-height: 60px;
            display: inline-block;
            float: none!important;
        }
        .my-state-css{
            width: 80px;
            height: 30px;
            text-align: center;
            line-height: 20px;
            display: inline-block;
        }
    </style>
</head>

<body data-type="chart">
        <!--标题-->
        <div class="tpl-content-page-title">
            工作流系统--作业
        </div>
        <!--面包屑-->
        <ol class="am-breadcrumb">
            <li><a href="#" class="am-icon-home">首页</a></li>
            <li><a href="#">调度</a></li>
            <li class="am-active">作业详情</li>
        </ol>
        <div class="tpl-portlet-components">
            <div class="tpl-portlet-components">

                <div class="portlet-title">
                    <div class="caption font-green bold">
                        作业详情
                    </div>
                </div>
                <div class="tpl-portlet-components"  style="min-width: 0; min-height: 0">
                    <div class="portlet-title">
                        <div class="caption font-green">
                            作业基本信息
                        </div>
                    </div>
                    <div class="am-g tpl-amazeui-form">
                        <div class="am-u-sm-12">
                            <form class="am-form am-form-horizontal">
                                <div class="am-form-group my-form-height">
                                    <div class="am-u-sm-6 my-form-height">
                                        <div class="my-form-label">作业号:</div>
                                        <div class="my-form-content" id="number"></div>
                                    </div>
                                    <div class="am-u-sm-6 my-form-height">
                                        <div class="my-form-label">作业名:</div>
                                        <div class="my-form-content" id="name"></div>
                                    </div>
                                </div>

                                <div class="am-form-group my-form-height">
                                    <div class="am-u-sm-6 my-form-height">
                                        <div class="my-form-label">作业状态:</div>
                                        <div class="my-form-content" id="state">
                                            <!--<div class="am-alert am-alert-success my-state-css">DONE</div>-->
                                            <!--<div class="am-alert am-alert-warning my-state-css">WARNING</div>-->
                                            <!--<div class="am-alert am-alert-danger my-state-css">ERROR</div>-->
                                            <!--<div class="am-alert am-alert-secondary my-state-css">DOING</div>-->
                                        </div>
                                    </div>
                                    <div class="am-u-sm-6 my-form-height">
                                        <div class="my-form-label">作业队列:</div>
                                        <div class="my-form-content" id="job_queue"></div>
                                    </div>
                                </div>

                                <div class="am-form-group my-form-height">
                                    <div class="am-u-sm-6 my-form-height">
                                        <div class="my-form-label">作业优先级:</div>
                                        <div class="my-form-content" id="priority"></div>
                                    </div>
                                    <div class="am-u-sm-6 my-form-height">
                                        <div class="my-form-label">调度策略:</div>
                                        <div class="my-form-content" id="scheduling_strategy"></div>
                                    </div>
                                </div>

                                <div class="am-form-group my-form-height">
                                    <div class="am-u-sm-6 my-form-height">
                                        <div class="my-form-label">作业提交时间:</div>
                                        <div class="my-form-content" id="start_time"></div>
                                    </div>
                                    <div class="am-u-sm-6 my-form-height">
                                        <div class="my-form-label">作业结束时间:</div>
                                        <div class="my-form-content" id="end_time"></div>
                                    </div>
                                </div>

                                <div class="am-form-group my-form-height">
                                    <div class="am-u-sm-6 my-form-height">
                                        <div class="my-form-label">作业执行时间:</div>
                                        <div class="my-form-content" id="run_time"></div>
                                    </div>
                                    <div class="am-u-sm-6 my-form-height">
                                        <div class="my-form-label">执行命令:</div>
                                        <div class="my-form-content" id="command" style="word-wrap: break-word; word-break: normal;"></div>
                                    </div>
                                </div>

                                <div class="am-form-group my-form-height">
                                    <div class="am-u-sm-12 my-form-height">
                                        <div class="my-form-label">依赖文件:</div>
                                        <div class="my-form-content" id="dependent_file"></div>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
                <div class="tpl-portlet-components" style="min-width: 0; min-height: 0">
                    <div class="portlet-title">
                        <div class="caption font-green">
                            运行节点信息
                        </div>
                    </div>
                    <div class="am-g tpl-amazeui-form">
                        <div class="am-u-sm-12">
                            <form class="am-form am-form-horizontal">
                                <div class="am-form-group my-form-height">
                                    <div class="am-u-sm-12 my-form-height">
                                        <div class="my-form-label">执行节点:</div>
                                        <div class="my-form-content" id="node_group">
                                        </div>
                                    </div>
                                </div>

                                <div class="am-form-group my-form-height">
                                    <div class="am-u-sm-12 my-form-height">
                                        <div class="my-form-label">执行目录:</div>
                                        <div class="my-form-content" id="run_table"></div>
                                    </div>
                                </div>

                                <div class="am-form-group my-form-height">
                                    <div class="am-u-sm-6 my-form-height">
                                        <div class="my-form-label">作业槽数:</div>
                                        <div class="my-form-content" id="job_slot"></div>
                                    </div>
                                    <div class="am-u-sm-6 my-form-height">
                                        <div class="my-form-label">内存使用量:</div>
                                        <div class="my-form-content" id="memorynum"></div>
                                    </div>
                                </div>

                                <div class="am-form-group my-form-height">
                                    <div class="am-u-sm-6 my-form-height">
                                        <div class="my-form-label">CPU占用数:</div>
                                        <div class="my-form-content" id="cpunum"></div>
                                    </div>
                                    <div class="am-u-sm-6 my-form-height">
                                        <div class="my-form-label">CPU执行时间:</div>
                                        <div class="my-form-content" id="cpu_time"></div>
                                    </div>
                                </div>

                                <div class="am-form-group my-form-height">
                                    <div class="am-u-sm-6 my-form-height">
                                        <div class="my-form-label">MPI进程数:</div>
                                        <div class="my-form-content" id="mpinum"></div>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>

<script type='text/javascript'>
var id = '<%= request.getAttribute("workId")%>';
</script>
<script src="${ctx}/assets/js/jQuery/jquery.min.js"></script>
<script src="${ctx}/assets/js/jQuery/jquery-1.9.1.js"></script>
<script src="${ctx}/assets/js/common/amazeui.min.js"></script>
<script src="${ctx}/assets/js/common/xcConfirm.js"></script>
<script src="${ctx}/assets/js/common/config.js"></script>
<script src="${ctx}/assets/js/common/app.js"></script>
<script src="${ctx}/assets/js/layer/layer.js"></script>
<script src="${ctx}/assets/js/job/jobDetail.js"></script>
</body>

</html>